<template>
	<view class="page">
		<view class="section">
			<text>奖品</text>
			<text style="color: red;">{{type}}</text>
		</view>
		<view class="section">
			<text>金额</text>
			<text style="color: green">￥{{ prizeAmount }}</text>
		</view>
		<view class="section">
			<text>审核状态</text>
			<text>{{ status }}</text>
		</view>
		<view class="section">
			<text >最晚审核时间</text>
			<text >{{ lastDate }}</text>
		</view>
		<view class="section">
			<img class="showImg" :src="screen" @click="previewImage(screen)">
			<img class="showImg" :src="screenshot" @click="previewImage(screenshot)">
		</view>
		<view class="section">
			<text>提交时间</text>
			<text>{{ createdAt }}</text>
		</view>
		<view class="section">
			<text>提交平台</text>
			<text style="color: red;">{{ platformName }}</text>
		</view>
		<view class="section">
			<text>店铺名称</text>
			<text >{{ name }}</text>
		</view>
		<view class="section">
			<text>手机尾号</text>
			<text>{{ phone }}</text>
			<button @click="copyPhone">复制</button>
		</view>
		<view class=" section">
			<text>用户信息</text>
			<text style="color: red;">{{ id }}</text>
			<button  @click="openUserDetail">拉黑</button>
			<uni-popup ref="bottomPopup" type="bottom">
			     <view class="popup-content">
						  <view class="form-item">
						          <text>是否拉黑：</text>
						          <radio-group v-model="isBlocked">
						            <label class="radio-label">
						              <radio :value="true" /> 是
						            </label>
						            <label class="radio-label">
						              <radio :value="false" /> 否
						            </label>
						          </radio-group>
						        </view>
						
						        <!-- 拉黑理由文本框 -->
						        <view class="form-item">
						          <text>拉黑理由：</text>
						          <textarea
						            v-model="blockReason"
						            placeholder="请填写拉黑理由"
						            rows="2"
						            maxlength="100"
						            class="reason-textarea"
						          />
						        </view>
						
						        <!-- 按钮区域 -->
						        <view class="popup-buttons">
						          <button @click="confirmBlock" class="confirm-btn">确认</button>
						          <button @click="closePopup" class="cancel-btn">取消</button>
						        </view>
			     </view>
			</uni-popup>
		</view>
		<view v-if="showImage" class="image-section">
			<image :src="imageSrc" mode="aspectFill"></image>
			<!-- <button @click="showImage = false">关闭</button> -->
		</view>
		<view class="buttons">
			<button type="primary" style="color: black; background-color: white;" @click="confirmReview">确认并审核通过</button>
			<button type="warn" style="color: black; background-color: white;" @click="rejectReview">拒绝驳回</button>
			<button type="warn" style="color: black; background-color: white;" @click="waitCheck">待审核</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				type:'',
				prizeAmount:0,
				status: 0,
				lastDate:'',
				screen:'',
				screenshot:'',
				createdAt:'',
				platformName:'',
				name:'',
				phone:0,
				id:1,
				reviewId:1,
				merchantId:1,
				blockReason:'',
				storeId:1,
			}
		},
		onShow(){
			 const pages = getCurrentPages();  // 获取当前页面栈
			 const currentPage = pages[pages.length - 1];  // 获取当前页面对象
			 const options = currentPage.options;  // 获取页面跳转时的参数
			 console.log('页面跳转时的参数:', options);
			this.reviewId=options.status
			console.log("reviewId2:"+this.reviewId);
			this.checkInfo();
		},
		methods: {
			waitCheck(){
				uni.navigateTo({
					url:`/pages/checkInfo/checkInfo?storeId=${this.storeId}`
				})
			},
			closePopup(){
				this.$refs.bottomPopup.close();
			},
			confirmBlock(){
				this.$refs.bottomPopup.close();
				uni.request({
						url:'http://zhaoyang.nat300.top/blacklist/add',
						method: 'POST',
						data: {
						  userId: this.id,
						  merchantId:this.merchantId,
						  reason:this.blockReason,
						},
						header: {
						  'content-type': 'application/json' // 默认值
						},
						success:(res)=>{
						  console.log('POST 请求成功:', res);
						  //处理lahei状态
						  uni.showToast({
						    title: '已拉黑',
						    icon: 'none'
						  });
	
						},
						fail(error) {
						  console.error('POST 请求失败:', error);
						  uni.showToast({
						    title: '拉黑失败，请重试',
						    icon: 'none'
						  });
						}
				})
			},
			 previewImage(url) {
			      // 使用 uni.previewImage 方法来预览图片
			      uni.previewImage({
			        urls: [url], // 图片URL数组，即使只有一张图片也需要是数组形式
			        current: url, // 当前显示图片的URL
			      });
			    },
		 async checkInfo(){
				console.log("reviewId:"+this.reviewId)
				await uni.request({
					url:'http://zhaoyang.nat300.top/review/find',
					method: 'POST',
					data: {
					  id: this.reviewId,
					},
					header: {
					  'content-type': 'application/json' // 默认值
					},
					success:(res)=>{
					  console.log('POST 请求成功:', res);
					  //处理审核状态
					  if(res.data.review.status==1){
						  this.status = "待审核"
					  }else if(res.data.review.status==2){
						  this.status = "审核通过"
					  }else if(res.data.review.status==3){
						  this.status = "审核驳回"
					  }
					  //处理电话后四位
					  this.phone = (res.data.user.phone+'').slice(-4);
					  this.type = res.data.price.type;
					  this.prizeAmount = res.data.review.prizeAmount;
					  this.lastDate = res.data.lastDate;
					  this.screen = res.data.review.screen;
					 this.screenshot = res.data.review.screenshot;
					 this.createdAt = res.data.review.createdAt;
					 this.platformName = res.data.review.platformName;
					 this.name = res.data.store.name;
					 this.id = res.data.user.id;
					 this.reviewId = res.data.review.id;
					 this.storeId = res.data.store.id;
					 this.merchantId = res.data.store.merchantId;
					 console.log("merchantId："+this.merchantId)
					},
					fail(error) {
					  console.error('POST 请求失败:', error);
					  uni.showToast({
					    title: '提交失败，请重试',
					    icon: 'none'
					  });
					}

			})
			},
			// showImage: false,
			// imageSrc: 'https://example.com/image.jpg', // 示例图片链接
			copyPhone() {
				uni.setClipboardData({
					data: this.phoneTail,
					success: () => {
						this.copyText = '已复制';
						setTimeout(() => {
							this.copyText = '复制';
						}, 2000);
					}
				});
			},
			openUserDetail() {
				this.$refs.bottomPopup.open();
				uni.request({
						url: 'http://zhaoyang.nat300.top/blacklist',
						method: 'POST',
						data: {
							storeId:this.storeId,
							type: '随机红包',
							min:this.minAmount,
							max:this.maxAmount,
							auto:1,
							price:1,
						},
						header: {
							'content-type': 'application/json' // 默认值
						},
					});
			},
			async confirmReview() {
				await uni.request({
						url:'http://zhaoyang.nat300.top/review/status',
						method: 'POST',
						data: {
						  id:this.merchantId,
						  reviewId:this.reviewId,
						  amount:this.prizeAmount,
						  status:2
						},
						header: {
						  'content-type': 'application/json' // 默认值
						},
						success:(res)=>{
						  console.log('POST 请求成功:', res);
						 uni.showToast({
						   title: '已审核',
						   icon: 'none'
						 });
						},
						fail(error) {
						  console.error('POST 请求失败:', error);
						  uni.showToast({
						    title: '提交失败，请重试',
						    icon: 'none'
						  });
						}
				})
			},
			rejectReview() {
				// 拒绝审核的逻辑
				uni.request({
						url:'http://zhaoyang.nat300.top/review/reject',
						method: 'POST',
						data: {
						  reviewId:this.reviewId,
						  status:3
						},
						header: {
						  'content-type': 'application/json' // 默认值
						},
						success:(res)=>{
						  console.log('POST 请求成功:', res);
						 uni.showToast({
						   title: '已驳回',
						   icon: 'none'
						 });
						},
						fail(error) {
						  console.error('POST 请求失败:', error);
						  uni.showToast({
						    title: '提交失败，请重试',
						    icon: 'none'
						  });
						}
				})
			}
		}
	}
</script>

<style scoped>
	.popup-content {
	  padding: 10rpx;
	  background-color: white;
	  border-radius: 10rpx;
	  width: 100%;
	  margin: 0 auto;
	}
	.form-item {
	  margin-bottom: 20rpx;
	  display: flex;
	  justify-content: space-between;
	}
	
	button {
		/* 清除默认样式 */
		appearance: none;
		-webkit-appearance: none;
		background-color: transparent;
		border: none;
		padding: 0 10rpx;
		margin: 0;
		outline: none;
		font-size: 30rpx;
	}

.page {
  padding: 20px;
  background-color: #f4f4f4; /* 灰色背景 */
}

.section {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
  padding: 10px;
  background-color: white; /* 白色背景 */

}
	
	
	.showImg{
		width: 300rpx;
		height: 300rpx;
	}



	.buttons {
		display: flex;
		justify-content: space-around;
		margin-top: 20px;
	}
</style>